<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>表格</title>
<%@ include file="../BasePage.jsp"%>
</head>
<body>
	<h2>DataGrid</h2>
	<table id="dg" class="easyui-datagrid"
		title="CheckBox Selection on DataGrid">
		<thead>
			<tr>
				<th colspan="3">113</th>
				<th colspan="4">456</th>
			</tr>
			<tr>
				<th data-options="field:'ck',checkbox:true"></th>
				<th data-options="field:'itemid',align:'center'">Item ID</th>
				<th data-options="field:'productid',align:'center'">Product</th>
				<th data-options="field:'listprice',align:'center'">List Price</th>
				<th data-options="field:'unitcost',align:'center'">Unit Cost</th>
				<th data-options="field:'attr1',align:'center'">Attribute</th>
				<th data-options="field:'status',align:'center'">Status</th>
			</tr>
		</thead>
	</table>
	<div style="margin: 10px 0;">
		<span>Selection Mode: </span> <select
			onchange="$('#dg').datagrid({singleSelect:(this.value==0)})">
			<option value="0">Single Row</option>
			<option value="1">Multiple Rows</option>
		</select><br /> SelectOnCheck: <input type="checkbox" checked
			onchange="$('#dg').datagrid({selectOnCheck:$(this).is(':checked')})"><br/>
		CheckOnSelect: <input type="checkbox" checked
			onchange="$('#dg').datagrid({checkOnSelect:$(this).is(':checked')})">
	</div>
</body>
</html>
<script type="text/javascript">
	$('#dg').datagrid({
	    toolbar: [{
			iconCls: 'icon-edit',
			handler: function(){alert('edit');}
		},'-',{
			iconCls: 'icon-help',
			handler: function(){alert('help');}
		}],
		rowStyler: function(index,row){
			if (row.listprice>70){
				return 'color:red;';
			}
		},
		width:600,
	    rownumbers:true,
	    singleSelect:false,
	    pagination:true,
	    url:"<%=path%>/demo/product.json",
	    pageSize : 10
	    });
</script>